<template>
  <el-dialog :title="title" :width="width"
             :visible.sync="isShowVisible"
             center :close-on-click-modal="false"
             :before-close="() => $emit('close')">
    <el-card>
      <iframe :src="iframeUrl" width="100%" height="600px" frameborder="0"></iframe>
    </el-card>
    <div slot="footer" class="dialog-footer">
      <el-button @click="$emit('close')">关闭</el-button>
    </div>
  </el-dialog>
</template>

<script>
  export default {
    name: 'flowDesign',
    props:{
      width:{
        type:String,
        default:'80vw'
      },
      modelId:{
        type:String,
      },
    },
    data(){
      return{
        title:'流程设计器',
        isShowVisible:true,
        iframeUrl:'',
      }
    },
    created() {
      this.iframeUrl = `${process.env.VUE_APP_WORKFLOWDESIGNURL}/activiti-editor/modeler.html?modelId=${this.modelId}`
    }
  }
</script>

<style scoped>

</style>
